<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!--bootstrap插件-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link href="/static/plugin/bootstrap/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet"/>
    <link href="/static/plugin/jo/joUI.css" rel="stylesheet"/>
    <!--字体插件-->
    <link href="/static/plugin/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
    <link href="/static/plugin/layui-2.4.3/css/layui.css" rel="stylesheet"/>
    <!--ztree-->
    <link href="/static/plugin/zTree/css/metroStyle/metroStyle.css" rel="stylesheet"/>
    <!--common-->
    <link href="/static/css/common.css" rel="stylesheet"/>
    <title>链路追踪表单</title>
    <style>
        .part-title{
            font-weight: 700;line-height: 20px;border-bottom: #448AFF solid 2px;margin-bottom: 5px;clear: both;
        }
        .young-form-input-block{
            word-break: break-all;
        }
        .young-form-label::after{
            content: ":";
            font-weight: 600;
        }
        /*使看起来更紧密*/
        .young-form-item{
            margin-bottom: 0px;
        }
    </style>
</head>
<body>
<div class="container-fluid">
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
            <form id="pageForm" name="pageForm" action="" method="post">
                <div class="part-title">基础信息</div>
                <div class="young-form-item col-md-6 must">
                    <div class="young-form-label">应用</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('应用名,例如:young-ums',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="appName" value="" class="form-control "  ErrEmpty="应用名不允许为空" />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">KEY</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('方法编号,通过Log注解指定,默认为类.方法',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="key" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">描述</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="keyInfo" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">类名</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="className" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">方法名</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="methodName" value="" class="form-control "   />
                    </div>
                </div>

                <div class="part-title">方法执行信息</div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">开始时间</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text" id="beginTime" value="" name="beginTime" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">结束时间</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text" id="endTime" value="" name="endTime" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">耗时/ms</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="ms" value="" class="form-control "  ErrNumber="耗时需填写数字类型" />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">服务器IP</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="serverIp" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">发生异常</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="hasEx" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">异常信息</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="ex" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">入参</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="inParam" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">出参</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="outParam" value="" class="form-control "   />
                    </div>
                </div>

                <div class="part-title">链路信息</div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">业务ID</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('业务编号,可以通过编码方式指定,例如的那个单编号,这样就可以通过业务id来查询相关数据',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="businessId" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 must">
                    <div class="young-form-label">链路追踪ID</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('链路ID,所有traceId相同的链路数据组成一条完整调用链',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="traceId" value="" class="form-control "  ErrEmpty="链路追踪id不允许为空" />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">块ID</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="spanId" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">父块ID</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="parentId" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">调用端请求时间</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('调用端发送调用请求的时间',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text" id="cs" value="" name="cs" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">服务端接收请求时间</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('服务端接收调用请求的时间',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text" id="sr" value="" name="sr" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">服务端响应时间</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('服务端发送响应的时间',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text" id="ss" value="" name="ss" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">调用端接收响应时间</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('调用端接收响应的时间',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text" id="cr" value="" name="cr" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">调用端ip</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="cip" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">服务端ip</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="sip" value="" class="form-control "   />
                    </div>
                </div>



                <div class="part-title">用户信息</div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">用户ID</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="userId" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">用户姓名</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="userName" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">用户IP</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="userIp" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">操作系统</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="os" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">浏览器</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="browser" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">请求协议</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('请求的协议,http/https等',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="scheme" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">请求HOST</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="host" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">请求端口号</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="port" value="" class="form-control "  ErrNumber="请求的端口号需填写数字类型" />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">请求URI</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="uri" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">请求URL</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="url" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">请求方式</div>
                    <div class="young-form-tips"><span class="fa fa-info-circle" onmouseover="window.tipsIdx=jo.tips('请求方式,post/get等',this,{tips:[2, '#3595CC'], time:10000});" onmouseout="jo.close(window.tipsIdx);"></span></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="method" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">请求referer</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="referer" value="" class="form-control "   />
                    </div>
                </div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">请求origin</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="origin" value="" class="form-control "   />
                    </div>
                </div>

                <div class="part-title">其他信息</div>
                <div class="young-form-item col-md-6 ">
                    <div class="young-form-label">扩展参数</div>
                    <div class="young-form-tips"></div>
                    <div class="young-form-input-block">
                        <input type="text"   name="extParam" value="" class="form-control "   />
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<!--配置信息-->
<script src="/static/js/config.js"></script>
<!--jquery-->
<script src="/static/plugin/jquery/jquery-3.3.1.js"></script>
<script src="/static/plugin/jquery/jquery.cookie.js"></script>
<!--bootstrap-->
<script src="/static/plugin/bootstrap/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<!--[if lt IE 9]>
<script src="/static/plugin/other/html5shiv.js"></script>
<script src="/static/plugin/other/respond.min.js"></script>
<![endif]-->
<!--layui-->
<script src="/static/plugin/layui-2.4.3/layui.all.js"></script>
<!--ztree-->
<script src="/static/plugin/zTree/js/jquery.ztree.all.js"></script>
<!--common-->
<script src="/static/js/common.js"></script>
<!--jo-->
<script src="/static/plugin/jo/jo.js"></script>
<script src="/static/plugin/jo/jo-adapt.js"></script>
<script src="/static/plugin/jo/jo-page-view.js"></script>
<script src="/static/plugin/jo/jo-page-form.js"></script>
<script src="/static/plugin/jo/jo-listener.js"></script>
<script type="text/javascript">
    layui.laydate.render({
        elem: '#cs' //注册日期控件
    });
    layui.laydate.render({
        elem: '#sr' //注册日期控件
    });
    layui.laydate.render({
        elem: '#ss' //注册日期控件
    });
    layui.laydate.render({
        elem: '#cr' //注册日期控件
    });
    layui.laydate.render({
        elem: '#beginTime' //注册日期控件
    });
    layui.laydate.render({
        elem: '#endTime' //注册日期控件
    });
    $(function(){
        var jParams = {
            "PKName" : "id",//主键属性名
            "saveAfter" : "toEdit",
            "addUrl" : "{URL_MONITOR}monitor/apiTrace/insert",//新增
            "deleteUrl" : "{URL_MONITOR}monitor/apiTrace/delete",//删除
            "updateUrl" : "{URL_MONITOR}monitor/apiTrace/update",//修改
            "formDataUrl" : "{URL_MONITOR}monitor/apiTrace/get",//查询
            //"readonly2Label" : true //只读转文本
        };
        joForm.initFormPage(jParams);//初始化
        jo.form2Label();
    });
    //初始化新增页面回调函数(在初始化按钮前发生)
    joForm.initFormPageOfAdd = function(){

    };
    //初始化表单值前处理
    joForm.initFormValueBefore = function(oJson){
        oJson.cs = jo.formatTimestamp(oJson.cs);
        oJson.sr = jo.formatTimestamp(oJson.sr);
        oJson.ss = jo.formatTimestamp(oJson.ss);
        oJson.cr = jo.formatTimestamp(oJson.cr);
        oJson.beginTime = jo.formatTimestamp(oJson.beginTime);
        oJson.endTime = jo.formatTimestamp(oJson.endTime);
        if(1 == oJson.hasEx){
            oJson.hasEx = '是';
        }else if(0 == oJson.hasEx){
            oJson.hasEx = '否';
        }
    };
    //初始化表单值后处理
    joForm.initFormValueAfter = function(oJson){

    };
    //新增请求提交前回调函数
    joForm.dealDataAtSaveBefore = function(oJson){

    };
    //修改请求提交前回调函数
    joForm.dealDataAtUpdateBefore = function(oJson){

    };
    /* 关于joForm更多回调函数和配置参数可查看jo-page-form.js */
</script>
</body>
</html>
